<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
	</head>
	<body>
<p>- 简述页面的结构组成?以及每部分功能?<br>
		页头（一般是放网站logo和导航链接),主体（就是网页内容部分),页尾（版权申明、使用协议等，也可放一些导航链接）<br>
		网页是一个包含HTML标签的纯文本文件，它可以存放在世界某个角落的某一台计算机中，是万维网中的一“页”，是超文本标记语言格式（标准通用标记语言的一个应用，文件扩展名为.html或.htm）。<br>
		网页通常用图像档来提供图画。网页要通过网页浏览器来阅读。<br>
</p>
<p>- 列举移动端开发时浏览器会遇到的几种常见兼容问题及解决方案?<br>
		1.iPhone下非a标签使用$.fn.on委托绑定没有作用。处理方案，给标签加上cursor属性<br>
		.event{<br>
		    cursor:pointer;<br>
		}<br>
		2.移动端使用iframe加载跨域网页出现“Refused to display in a frame becuase it set 'X-Frame-Options' to 'SAMEORIGIN”<br>
		　　本人使用的跨域页面是移动官网"http://wap.10086.cn/",如果使用pc地址"http://www.10086.cn/"则不会发生此问题。<br>
		　　原因：出于安全考虑，有的网站屏蔽了外部iframe的调用，比如上面的移动的移动端网页wap,而移动pc端则没有屏蔽。<br>
		　　解决方案：<br>
		　　在网上找解决方案，但是没有找到真正有用的。有几个方法被网友认为可行，但是我这里也没有用，<br>
		　　如果支持前端来说，这个应该是没有解决方案的，毕竟要访问的网页不是自己的。唯一的办法是让后台的同事帮忙使用默认浏览器打开这个网站。<br>
		3. webview中 sumsung手机使用margin-left:auto;margin-right:auto;来实现水平居中会导致该居中元素的宽度设置失效，宽度会自动填满居中区域。<br>
		　　解决方案：定位+左距离50%+左偏移元素宽度的一半<br>
			.center{<br>
				position:relative;<br>
				left:50%;<br>
				margin-left:-100px;<br>
			}<br>
		4.webview中 sumsung定义高度不起作用<br>
		　　解决方案：逼不得已使用padding撑起高度<br>
		5.webview中 sumsung margin-left不起作用<br>
		　　解决方案：逼不得已使用padding-left<br>
		6. webview中 iso input宽度置为0还是有显示区域。<br>
			解决方法是“width:0px;z-index:-1;border:none”。<br>
		7.多行省略<br>
		　　单行省略比较简单<br>
			white-space:nowrap; <br>
			text-overflow:ellipsis;<br>
			overflow:hidden;<br>
		　　合适WebKit浏览器或移动端（绝大部分是WebKit内核的）浏览器<br>
		    display: -webkit-box;<br>
		    -webkit-line-clamp: 2;<br>
		    -webkit-box-orient: vertical;<br>
		    overflow: hidden;<br>
</p>
<p>- 列举PC端前端开发时浏览器会遇到的几种常见兼容问题以及解决方案?
		浏览器兼容问题一：不同浏览器的标签默认的外补丁和内补丁不同<br>
		问题症状：随便写几个标签，不加样式控制的情况下，各自的margin 和padding差异较大。<br>
		碰到频率:100%<br>
		解决方案：CSS里    *{margin:0;padding:0;}<br>
		备注：这个是最常见的也是最易解决的一个浏览器兼容性问题，几乎所有的CSS文件开头都会用通配符*来设置各个标签的内外补丁是0。<br>
		浏览器兼容问题二：块属性标签float后，又有横行的margin情况下，在IE6显示margin比设置的大<br>
		问题症状：随便写几个标签，不加样式控制的情况下，各自的margin 和padding差异较大。<br>
		碰到频率:100%<br>
		解决方案：CSS里    *{margin:0;padding:0;}<br>
		备注：这个是最常见的也是最易解决的一个浏览器兼容性问题，几乎所有的CSS文件开头都会用通配符*来设置各个标签的内外补丁是0。<br>
		浏览器兼容问题三：设置较小高度标签（一般小于10px），在IE6，IE7，遨游中高度超出自己设置高度<br>
		问题症状：IE6、7和遨游里这个标签的高度不受控制，超出自己设置的高度<br>
		碰到频率：60%<br>
		解决方案：给超出高度的标签设置overflow:hidden;或者设置行高line-height 小于你设置的高度。<br>
		备注：这种情况一般出现在我们设置小圆角背景的标签里。出现这个问题的原因是IE8之前的浏览器都会给标签一个最小默认的行高的高度。即使你的标签是空的，这个标签的高度还是会达到默认的行高。<br>
		浏览器兼容问题四：行内属性标签，设置display:block后采用float布局，又有横行的margin的情况，IE6间距bug<br>
		问题症状：IE6里的间距比超过设置的间距<br>
		碰到几率：20%<br>
		解决方案：在display:block;后面加入display:inline;display:table;<br>
		备注：行内属性标签，为了设置宽高，我们需要设置display:block;(除了input标签比较特殊)。在用float布局并有横向的margin后，在IE6下，他就具有了块属性float后的横向margin的bug。<br>
		不过因为它本身就是行内属性标签，所以我们再加上display:inline的话，它的高宽就不可设了。这时候我们还需要在display:inline后面加入display:talbe。<br>
		浏览器兼容问题五：图片默认有间距<br>
		问题症状：几个img标签放在一起的时候，有些浏览器会有默认的间距，加了问题一中提到的通配符也不起作用。<br>
		碰到几率：20%<br>
		解决方案：使用float属性为img布局<br>
		备注：因为img标签是行内属性标签，所以只要不超出容器宽度，img标签都会排在一行里，但是部分浏览器的img标签之间会有个间距。去掉这个间距使用float是正道。<br>
		（我的一个学生使用负margin，虽然能解决，但负margin本身就是容易引起浏览器兼容问题的用法，所以我禁止他们使用）<br>
		浏览器兼容问题六：标签最低高度设置min-height不兼容<br>
		问题症状：因为min-height本身就是一个不兼容的CSS属性，所以设置min-height时不能很好的被各个浏览器兼容<br>
		碰到几率：5%<br>
		解决方案：如果我们要设置一个标签的最小高度200px，需要进行的设置为：{min-height:200px; height:auto !important; height:200px; overflow:visible;}<br>
		备注：在B/S系统前端开时，有很多情况下我们又这种需求。当内容小于一个值（如300px）时。容器的高度为300px；当内容高度大于这个值时，容器高度被撑高，而不是出现滚动条。<br>
		这时候我们就会面临这个兼容性问题。<br>
		浏览器兼容问题七：透明度的兼容CSS设置<br>
		做兼容页面的方法是：每写一小段代码（布局中的一行或者一块）我们都要在不同的浏览器中看是否兼容，当然熟练到一定的程度就没这么麻烦了。<br>
		建议经常会碰到兼容性问题的新手使用。很多兼容性问题都是因为浏览器对标签的默认属性解析不同造成的，只要我们稍加设置都能轻松地解决这些兼容问题。<br>
		如果我们熟悉标签的默认属性的话，就能很好的理解为什么会出现兼容问题以及怎么去解决这些兼容问题。<br>
		/* CSS hack*/ <br>
		我很少使用hacker的，可能是个人习惯吧，我不喜欢写的代码IE不兼容，然后用hack来解决。不过hacker还是非常好用的。<br>
		使用hacker我可以把浏览器分为3类：IE6 ；IE7和遨游；其他（IE8 chrome ff safari opera等）<br>
		◆IE6认识的hacker 是下划线_ 和星号 *<br>
		◆IE7 遨游认识的hacker是星号 *<br>
		比如这样一个CSS设置：<br>
		height:300px;*height:200px;_height:100px; <br>
		IE6浏览器在读到height:300px的时候会认为高时300px；继续往下读，他也认识*heihgt， 所以当IE6读到*height:200px的时候会覆盖掉前一条的相冲突设置，认为高度是200px。<br>
		继续往下读，IE6还认识_height,所以他又会覆盖掉200px高的设置，把高度设置为100px；<br>
		IE7和遨游也是一样的从高度300px的设置往下读。当它们读到*height200px的时候就停下了，因为它们不认识_height。<br>
		所以它们会把高度解析为200px，剩下的浏览器只认识第一个height:300px;所以他们会把高度解析为300px。<br>
		因为优先级相同且想冲突的属性设置后一个会覆盖掉前一个，所以书写的次序是很重要的。<br>
</p>
<p>- DOM对象与jQuery对象间的区别及如何转换?<br>
		jQuery对象转成DOM对象：<br>
		两种转换方式将一个jQuery对象转换成DOM对象：[index]和.get(index); <br>
		(1)jQuery对象是一个数据对象，可以通过[index]的方法，来得到相应的DOM对象。 <br>
		如：var $v =$("#v") ; //jQuery对象 <br>
		var v=$v[0]; //DOM对象 <br>
		alert(v.checked) //检测这个checkbox是否被选中 <br>
		(2)jQuery本身提供，通过.get(index)方法，得到相应的DOM对象 <br>
		如：var $v=$("#v"); //jQuery对象 <br>
		var v=$v.get(0); //DOM对象 <br>
		alert(v.checked) //检测这个checkbox是否被选中 <br>
		
		DOM对象转成jQuery对象: <br>
		对于已经是一个DOM对象，只需要用$()把DOM对象包装起来，就可以获得一个jQuery对象了。$(DOM对象) <br>
		如：var v=document.getElementById("v"); //DOM对象 <br>
		var $v=$(v); //jQuery对象 <br>
		转换后，就可以任意使用jQuery的方法了。 <br>
		通过以上方法，可以任意的相互转换jQuery对象和DOM对象。需要再强调注意的是：DOM对象才能使用DOM中的方法，jQuery对象是不可以用DOM中的方法。 <br>
		
		下面是其它的相关使用方法：<br>
		1、DOM对象转jQuery对象 <br>
		普通的Dom对象一般可以通过$()转换成jQuery对象。 <br>
		如：$(document.getElementById("msg")) <br>
		返回的就是jQuery对象，可以使用jQuery的方法。 <br>
		
		2、jQuery对象转DOM对象 <br>
		由于jQuery对象本身是一个集合。所以如果jQuery对象要转换为Dom对象则必须取出其中的某一项，一般可通过索引取出。 <br>
		如： $("#msg")[0]，$("div").eq(1)[0]，$("div").get()[1]，$("td")[5] <br>
		这些都是Dom对象，可以使用Dom中的方法，但不能再使用jQuery的方法。 <br>
		
		以下几种写法都是正确的： <br>
		$("#msg").html(); <br>
		$("#msg")[0].innerHTML; <br>
		$("#msg").eq(0)[0].innerHTML; <br>
		$("#msg").get(0).innerHTML;<br>

</p>
<p>- 如何获取当前网页及浏览器的相关信息?<br>
		window.navigator.userAgent<br>
</p>
<p>- 什么是闭包, 使用闭包的优缺点概述?<br>
		一、变量的作用域 要理解闭包，首先必须理解Javascript特殊的变量作用域。 变量的作用域无非就是两种：全局变量和局部变量。 <br>
		Javascript语言的特殊之处，就在于函数内部可以直接读取全局变量。  <br>
		 二、如何从外部读取局部变量？ 出于种种原因，我们有时候需要得到函数内的局部变量。<br>
		 但是，前面已经说过了，正常情况下，这是办不到的，只有通过变通方法才能实现。 那就是在函数的内部，再定义一个函数。   <br>
		 三、闭包的概念  各种专业文献上的“闭包”（closure）定义非常抽象，很难看懂。我的理解是，闭包就是能够读取其他函数内部变量的函数。<br> 
		 由于在Javascript语言中，只有函数内部的子函数才能读取局部变量，因此可以把闭包简单理解成“定义在一个函数内部的函数”。 <br>
		 所以，在本质上，闭包就是将函数内部和函数外部连接起来的一座桥梁。 <br>
		 四、闭包的用途 闭包可以用在许多地方。它的最大用处有两个，一个是前面提到的可以读取函数内部的变量，另一个就是让这些变量的值始终保持在内存中。<br>
</p>
	</body>
</html>
